<template>
  <div id="app">
    <!-- 保持当前路由为存活状态
       一个组件如果加上了keep-alive那么这个组就只会执行一次生命周期，并且不会destory
    -->
    <keep-alive>
      <router-view v-if="$route.meta.keepAlive"/>
    </keep-alive>
    <router-view v-if="!$route.meta.keepAlive"></router-view>
    <!--等待动画  -->
    <loading v-if="isShowLoading"></loading>
    <!-- 底部弹出的菜单-->
    <action-sheet v-if="isShowActionSheet"></action-sheet>
		<preview-image v-if="isShowPreviewImage"></preview-image>
  </div>
</template>
<script>
import loading from "./components/loading.vue"
import {mapGetters} from "vuex";
import actionSheet from "./components/actionSheet.vue";
import previewImage from "./components/PreviewImage.vue";
export default {
  name:"App",
  computed:{
    ...mapGetters(["isShowLoading","isShowActionSheet","isShowPreviewImage"])
  },
  components:{
    loading,actionSheet,previewImage
  }
}
</script>

<style lang="scss">
*{
  margin:0;
  padding:0;
  list-style-type: none;
  font-size: .32rem;
}
#app{
  height:100vh;
  width: 100vw;
  overflow: auto;
}

</style>
